

let signBtn = document.querySelectorAll('.login-right .sign a');
let signBox = document.querySelectorAll('.signBox');
let btn = document.querySelector('.sign-in button ')
console.log(signBtn);

signBtn.forEach(function (v, i) {
    v.onclick = function () {
        signBtn.forEach(function (v2, i2) {
            v2.className='';
        })
        v.className = 'signClick';

        signBox.forEach(function(v3,i3){
            v3.style.display='none';
        })

        signBox[i].style.display='block';
    }
});



// 登录表单验证
let form = document.querySelector('.sign-in form')


let mask = document.querySelector('.sign-in .mask');
function showMask(){
    setTimeout(function(){
        mask.style.display = "none"
    },3000)    
}
form.onsubmit = function(){
    let pass = true;
    let user = document.querySelector('.sign-in .user');
    let pwd = document.querySelector('.sign-in .pwd');
    console.log(mask);
    
    //判断用户名
    if(user.value.length>=2 && user.value.length<=6){
        mask.style.display='none';
        pass = true
    }else{
        mask.style.display='block';
        mask.innerHTML='用户名格式不正确';
        showMask()
        return false;
    };


    //判断密码
    if(pwd.value.length>=6 && pwd.value.length<=10){
        mask.style.display='none';
        pass = true
    }else{
        mask.style.display='block';
        mask.innerHTML='密码格式不正确'; 
        showMask()
        pass = false;

    };


    if(pass===true){
        mask.style.display='block';
        mask.innerHTML='登录成功';
        showMask()
    }
    

        return pass; //提交事件
        
    }

//登录表单事件input事件,点X删除内部的东西
let user = document.querySelector('.sign-in .user');
let pwd = document.querySelector('.sign-in .pwd');
let userX = document.querySelector('.userX')
let pwdX = document.querySelector('.pwdX')
user.oninput = function(){
    userX.style.display='block'
}

pwd.oninput = function(){
    pwdX.style.display='block'
}

userX.onclick = function(){
    user.value=''
}
pwdX.onclick = function(){
    pwd.value=''
}




